import { Component, OnInit ,ViewChild} from '@angular/core';

import { MatDialog } from '@angular/material';
import { AddModalComponent } from './add-modal/add-modal.component';
import { Subject, Observable, Subscribable, Subscription, BehaviorSubject } from 'rxjs';
import { ListResult, ListOption, APIBase, ArrayAPIBase } from 'app/modules/base/api-base'
import { MySelection } from 'app/modules/base/selection';
import { switchMap, scan, map } from 'rxjs/operators';
import { PaginationComponent } from 'app/modules/share/components/pagination/pagination.component';
import _ from 'lodash';
import { ToasterService } from 'app/modules/share/services/toaster.service';
@Component({
  selector: 'm-step2-select-personnel',
  templateUrl: './step2-select-personnel.component.html',
  styleUrls: ['./step2-select-personnel.component.scss']
})
export class Step2SelectPersonnelComponent implements OnInit {
  datasource$ = new BehaviorSubject<Array<any>>([])
  selection = new MySelection<any>('id');
  constructor(
    private dialog:MatDialog,
    private toaster: ToasterService,
    ) { 

    }
  query$ = new BehaviorSubject<ListOption>({ page: 1 });
  @ViewChild('page') pageComponent: PaginationComponent;
  persionnel$ = this.query$.pipe(
    map((page) => {
     if(this.datasource$.value){
      return {
        list:this.datasource$.value.slice((page.page-1)*10,page.page*10),
        total:this.datasource$.value.length
      }
     }
    }),
    
  )
  ngOnInit() {
  }
  pageChange(n){
    this.query$.next({ page: n })
  }
  delete(){
    if(!this.selection.selected || !this.selection.selected.length){
      this.toaster.warn('请选择任务执行内容');
    }
    let result =  _.difference(this.datasource$.value, this.selection.selected)
    this.datasource$.next(result);
    this.selection.clear()
    this.pageComponent.page = 1
    this.pageChange(1)
    
  }
  singleDelete(id){
    let result =  this.datasource$.value.filter(item=>item.id != id)
    this.datasource$.next(result);
    this.selection.clear()
    this.pageComponent.page = 1
    this.pageChange(1)
  }
  async openModal(c: any) {
    const addDialog = this.dialog.open(c, { width: '1120px' ,data:{select:this.datasource$.value}});
    addDialog.afterClosed().subscribe(data => {
      if(data){
        let result = [...this.datasource$.value,...data]
        this.datasource$.next(result);
        this.pageComponent.page = 1
        this.pageChange(1)
      }
     
     
    });
  }
  addComputer() {
    this.openModal(AddModalComponent);
  }
}
